import React from "react";
import { configureStore } from "@reduxjs/toolkit";
import { Provider } from "react-redux";
import { MemoryRouter } from "react-router-dom";

import "./App.css";
import Counter from "./components/counter";
import DelayCounter from "./components/delay_counter";
import ReduxCounter from "./components/redux_counter";
import { initialState, reducer, State } from "./store/reducer";
import CounterProvider, { ContextCounter } from "./components/context_counter";
import TestRouter from "./components/router_component";
import AxiosTest from "./components/http_component";

function App() {
  const store = configureStore({
    reducer,
    preloadedState: initialState as State,
  });
  return (
    <div className="App">
      前端测试学习
      <Counter />
      <DelayCounter />
      <Provider store={store}>
        <ReduxCounter />
      </Provider>
      <CounterProvider>
        <ContextCounter />
      </CounterProvider>
      <MemoryRouter>
        <TestRouter />
      </MemoryRouter>
      <AxiosTest url="/greeting" />
    </div>
  );
}

export default App;
